<template>
  <div class="ec-chat-r">
    <div class="chat-box-r">
      {{chattxtr}}
      <div class="chat-box-r-name">{{chatuser}}</div>
    </div>
    <div class="ec-user-img"><img src="static/images/eng-corner/chatuser2.png" alt=""/></div>
  </div>
</template>
<script>
  export default{
    name:'ec-chat-l',
    props:['chattxtr','chatuser']
  }
</script>
<style>
  .ec-chat-r {
    width: 100%;
    display: flex;
  }
  .ec-user-img{
    margin-top: 80px;
  }
  .ec-user-img img{
    width: 140px;
    height:140px;
  }
  .chat-box-r{
    width:70%;
    padding: 50px 20px;
    margin: 0 2%;
    height:50px;
    border: 1px solid #ddd;
    background: #ffffff;
    border-radius:40% 30% 0 40%;
    box-shadow: 10px 10px 10px #ddd;
    color:#ED6942;
    font-size: 30px;
  }
  .chat-box-r-name{
    align-self: flex-end;
    text-align: right;
    color:#ED6942;
    opacity: .6;
    font-size: 18px;
    margin: 10px 0;
  }
</style>

